import { HOME_URL } from "../../../../constants";
import type { RootState } from "../../../../store";
import { Breadcrumb } from "antd";
import { useSelector } from "react-redux";
import { useLocation } from "react-router-dom";

const BreadCrumbNav = () => {
  const { pathname } = useLocation();
  const { themeConfig } = useSelector((state: RootState) => state.global);
  const { breadcrumbList } = useSelector((state: RootState) => state.breadcrumb);

  const list = (breadcrumbList[pathname] || []).map((item: string | undefined) => ({title: item}))

  if (!list.find((item: any) => item.title === "首页")) {
    list.unshift({
      title: "首页",
      path: HOME_URL,
    })
  }

  return (
    <>
      {
        !themeConfig.breadcrumb && (
          <Breadcrumb items={list}></Breadcrumb>
        )
      }
    </>
  )
}

export default BreadCrumbNav;